﻿<html>
    <head>
    <meta charset="UTF-8"/>
    <meta name="Keywords" content=""/>
    <meta name="Description" content=""/>
    <title>Personal profile</title>
    <link type="text/css" href="css/all.css" rel="stylesheet" />
    <script type="text/javascript" src="js/jquery.js"></script>
    <style>
	.breadcrumbs {width: 100%;text-align: left;margin-top: 20px;border-bottom: 1px solid #e6e6e6;padding-bottom: 20px;}
	.breadcrumbs p { text-transform: uppercase; font-weight: bold; }
	.breadcrumbs a { display: inline-block; padding: 1px 17px 0 0; margin-right: 10px; background: url('images/bc-arrow.gif') right no-repeat; color: #1D2339; }
	.changepwd p { position: relative; }
	.changepwd p.loginHint { color: #9EA7B3; font-size: 10px; margin-bottom: 10px; word-spacing: -1px; }
	.changepwd input.login.password { background: url("images/pass.png") no-repeat scroll -2px -2px; border: 0 none; height: 46px;  line-height:46px;
	font-size: 12px; width: 288px; padding-left: 34px; display: block; }
	.changepwd input.inputstyle { background: url("images/input.png") no-repeat scroll -2px -2px; border: 0 none; height: 42px;  line-height:42px;
	font-size: 12px; width: 288px; padding-left: 34px; display: block; }
	.changepwd p.loginHint { color: #9EA7B3; font-size: 10px; margin-bottom: 10px; word-spacing: -1px; }
	input.loginimage { background: url("images/secure-login.png"); border: 0 solid #FFFFFF; cursor: pointer; height: 53px; width: 299px; color: #fff; font-size: 18px; font-weight: bold; }
	.container { text-align: left; width: 620px; }
	.side-nav {width: 280px;height: 520px;padding-top: 20px;margin:1px;background:#f6f6f6;border-right: 1px solid #e6e6e6;}
	.side-nav .service-rate { }
	.side-nav .service-rate li h3 { background: url(images/01.png) no-repeat 25px center; color: #000; font-size: 16px; }
	.side-nav .service-rate li a {height: 24px;line-height: 24px;font-size: 12px;overflow: hidden;margin-left: 10px;display: block;text-align: left;text-indent: 6em;color: #424278;background: url(images/jticon.png) no-repeat scroll 45px 5px;}
</style>
<link href="${rc.getContextPath()}/resources/css/common.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="${rc.getContextPath()}/resources/js/jquery.js"></script>
<script type="text/javascript" src="${rc.getContextPath()}/resources/js/jquery.validate.js"></script>
<script type="text/javascript">
var base = '${rc.getContextPath()}';
$(document).ready(function() {	
	var msg = "${msg}";
	if (msg) {
		alert(msg);
	}

	var $inputForm = $("#saveForm");
	$inputForm.validate({
		errorClass : "fieldError",
		rules : {
			age:"number",
			email:{
				email:true,
				required:true,
				remote: {
                    type: "post",
                    url: "${rc.getContextPath()}/front/ajaxEmail.html",
                    data: {
                    	email:function() {
                            return $("#txtEmail").val();
                        },
                        memberId : "${member.memberId}"
                    },
                    dataType: "html",
                    dataFilter: function(data, type) {
                    	eval("var data  = "+data+";");
                        if (data.msg == "true")
                            return "true";
                        else {
                        	var errMsg = data.msg;
                        	if (errMsg && errMsg.indexOf("已存在")){
                        		errMsg = "Username is exists";
                        	}
                            return errMsg;	                        
                        }
                    }
                }
			}
		}
	});
});

function updateMember() {
	$("#saveForm").submit();
}
</script>
    </head>
<body>
 <#include "${base!}/front/header.html"/>
<div class="main">
  <div class="wrap">
  <div class="breadcrumbs fleft">
              <p>
                <a href="#">Account management</a> <span class="access"></span>
                <a href="#">Personal profile</a> <span class="access"></span>
              </p>
            </div> 
  	<div class="fleft side-nav">
        <ul class="service-rate">
        <li>
            <h3>Account management</h3>
        </li>
        <li>
        	<a class="track " href="${base!}/front/personal.html" style="color:#F78F07">Personal profile</a>
        </li>
        <li>
        	<a class="track" href="${base!}/front/memberpwd.html">Change password</a>
        </li>
        <li>
        	<a class="track" href="${base!}/front/bindMemberCard.html">Binding membership card </a>
        </li>
        </ul>
    </div> 
    <div class="fright container" >
            <form id="saveForm" action="${base!}/front/updateMember.html" class="changepwd" style="margin-top:10px" method="post">
            	<input type="hidden" name="memberId" value="${member.memberId}"/>
            	<!-- <p><input type="text" name="email" id="txtEmail" value="${member.email}" class="inputstyle"/></p>
                <p class="loginHint">Fill in Real Email</p>
                <p><input type="text" name="realName" id="txtRealName" value="${member.realName}" class="inputstyle"/></p>
                <p class="loginHint">Fill in Real Name</p>
                <p>
					<select name="sex" style="width:100px;height: 25px">
						<option value=""></option>
						<option value="1" <#if member.sex=='1'>selected</#if>>Male</option>
						<option value="0" <#if member.sex=='0'>selected</#if>>Female</option>
					</select>
				</p>
                <p class="loginHint">Fill in Sex</p>
                <p><input type="text" name="age" id="txtAge" value="${member.age}" class="inputstyle"/></p>
                <p class="loginHint">Fill in Age</p>
                <p><input type="text" name="telephone" id="txtTelephone" value="${member.telephone}" class="inputstyle"/></p>
                <p class="loginHint">Fill in Telephone</p>
                <p><input type="text" name="address" id="txtAddress" value="${member.address}" class="inputstyle"/></p>
                <p class="loginHint">Fill in Address</p>
                <p><textarea name="description" cols="50" rows="10">${member.description}</textarea></p>
                <p class="loginHint">Fill in Description</p> -->
                
                <table style="width: 100%;">
                	<tr height="50px">
                		<th width="110px">Email:</th>
                		<td><input type="text" name="email" id="txtEmail" value="${member.email}" class="inputstyle"/></td>
                	</tr>
                	<tr height="50px">
                		<th width="110px">Real Name:</th>
                		<td><input type="text" name="realName" id="txtRealName" value="${member.realName}" class="inputstyle"/></td>
                	</tr>
                	<tr height="40px">
                		<th width="110px">Sex:</th>
                		<td>
							<input type="radio" name="sex" value="1" <#if member.sex=='1'>checked</#if>/> Male 
							<input type="radio" name="sex" value="0" <#if member.sex=='0'>checked</#if>/> Female 
						</td>
                	</tr>
                	<tr height="50px">
                		<th width="110px">Age:</th>
                		<td><input type="text" name="age" id="txtAge" value="${member.age}" class="inputstyle"/></td>
                	</tr>
                	<tr height="50px">
                		<th width="110px">Tel:</th>
                		<td><input type="text" name="telephone" id="txtTelephone" value="${member.telephone}" class="inputstyle"/></td>
                	</tr>
                	<tr height="50px">
                		<th width="110px">Add:</th>
                		<td><input type="text" name="address" id="txtAddress" value="${member.address}" class="inputstyle"/></td>
                	</tr>
                	<tr height="60px">
                		<th width="110px">Description:</th>
                		<td>
                			<textarea name="description" cols="50" rows="10">${member.description}</textarea>
                		</td>
                	</tr>
                	<tr height="50px">
                		<td></td>
                		<td>
                			<input type="button" class="loginimage" border="0" value="Change" onclick="updateMember()"/>
                		</td>
                	</tr>
                </table>
                
            </form>
    </div>
  </div>
</div>
<#include "${base!}/front/footer.html"/>
</body>
</html>
